<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="renderer" content="webkit" />
		<meta name="robots" content="index, follow" />
		<title>会员意见反馈</title>
		<meta name="keywords" content="" />
		<meta name="description" content="" />
		<meta name="author" content="order by website" />
		<script type="text/javascript" src="__XIAOHE__/js/jquery.min.js"></script>
		<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
		 crossorigin="anonymous"></script>
		<link rel="stylesheet" type="text/css" href="__XIAOHE__/css/bootstrap.min.css" media="screen" />
		<script src="__XIAOHE__/js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" type="text/css" href="__XIAOHE__/css/style.css" />
		<link rel="stylesheet" type="text/css" href="__XIAOHE__/css/swiper.min.css" />
		<link rel="stylesheet" type="text/css" href="__XIAOHE__/css/animate.css" />
		<link rel="stylesheet" type="text/css" href="__XIAOHE__/css/font-awesome.min.css" />
		<!-- 引入样式文件 -->
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.2/lib/index.css">

		<!-- 引入 Vue 和 Vant 的 JS 文件 -->
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/vant@2.2/lib/vant.min.js"></script>
		<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
	</head>
	<body>
		<div id="app">
			<div class="row">
				<div class="col-xs-12" style="padding: 0;">
					<div class="hyyjfk">
						<div class="myswiper">
							<div class="swiper-container swiper-no-swiping">
								<div class="swiper-wrapper">
									<div class="swiper-slide" style="background: url(__XIAOHE__/images/index1.jpg) no-repeat center;"></div>
									<div class="swiper-slide" style="background: url(__XIAOHE__/images/index2.jpg) no-repeat center;"></div>
								</div>
							</div>
						</div>
						<div class="hyyjfk1">
							<div class="hyyjfk1a">会员意见反馈</div>
							<div class="hyyjfk1b">亲～，请留下您宝贵的意见，我们会认真对待您的任何反馈。</div>
						</div>
						<div class="hyyjfk2">
							<div class="hyyjfk2a" v-for="(value1,key1) in list">
								<div class="hyyjfk2ab">
									{{value1.name}}
								</div>
								<div v-if="value1.type == '1'">
									<div class="hyyjfk2aa" v-for="(value2,key2) in value1.dxt">
										<!-- <el-radio v-model="value1.radio" :label='key2'>{{value2.name}}</el-radio> -->
										<van-radio-group v-model="value1.radio">
											<van-radio :name='key2'>{{value2.name}}</van-radio>
										</van-radio-group>
									</div>

								</div>
								<div class="hyyjfk2ac" v-else-if="value1.type == '2'">
									<van-cell-group>
										<van-field v-model="value1.input" placeholder="" />
									</van-cell-group>
								</div>
								<div class="hyyjfk2ac" v-else-if="value1.type == '3'">
									<van-cell-group>
										<van-field v-model="value1.input" type="textarea" placeholder="" rows="2" autosize />
									</van-cell-group>
								</div>
							</div>
						</div>
						<div class="tijiao">

							<van-button @click="dianji()" plain hairline type="primary" icon="smile">提交</van-button>
						</div>
					</div>
					<div class="jszc">
						君亿视觉
					</div>
				</div>
			</div>
		</div>
	</body>
</html>

<script>
	new Vue({
		el: '#app',
		data: function() {
			return {

				list: [{
						id: 1,
						name: '您所属的门店？',
						radio: '',
						type: 1,
						dxt: [{
								name: '梁溪区九龙仓时代上城店'
							},
							{
								name: '滨湖区瑞延店'
							}
						]
					},
					{
						id: 2,
						name: '您对我们的服务满意么？',
						radio: '',
						type: 1,
						dxt: [{
								name: '非常满意'
							},
							{
								name: '满意'
							},
							{
								name: '一般'
							},
							{
								name: '不满意'
							},
							{
								name: '非常不满意'
							}
						]
					},
					{
						id: 2,
						name: '您最喜欢的部分是什么？',
						radio: '',
						type: 1,
						dxt: [{
								name: '团操课'
							},
							{
								name: '私教课'
							},
							{
								name: '有氧区'
							},
							{
								name: '力量区'
							},
							{
								name: '泳池区'
							},
							{
								name: '其他'
							}
						]
					},
					{
						id: 2,
						name: '您对我们还有什么建议',
						radio: '',
						type: 3,
						input: '',
					},
					{
						id: 2,
						name: '如果您希望我们联系您，可以留下您的手机号或者微信号',
						radio: '',
						type: 2,
						input: '',
					}
				]
			}
		},
		methods: {
			dianji() {
				var list = this.list
				console.log(list)
				axios.post('/user', {
						list: list
					})
					.then(function(response) {
						console.log(response);
					})
					.catch(function(error) {
						console.log(error);
					});
			}
		}
	})
</script>
<script>
	var swiper = new Swiper('.swiper-container', {
		autoplay: {
			delay: 3000,
			stopOnLastSlide: false,
			disableOnInteraction: true,
		},
	});
</script>
